<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>橡树科技－JavaDemoSystem</title>
<link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
<link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
<script language="javascript" type="text/javascript">
            //写入下拉框中的年份和月份
            function initialYearAndMonth() {
                //写入最近3年
                var yearObj = document.getElementById("selYears");
                var year = (new Date()).getFullYear();
                for (var i = 0; i <= 2; i++) {
                    var opObj = new Option(year - i, year - i);
                    yearObj.options[i] = opObj;
                }
                //写入 12 月
                var monthObj = document.getElementById("selMonths");
                var opObj = new Option("全部", "全部");
                monthObj.options[0] = opObj;
                for (var i = 1; i <= 12; i++) {
                    var opObj = new Option(i, i);
                    monthObj.options[i] = opObj;
                }
            }
        </script>
</head>
<body onLoad="initialYearAndMonth();">
 
<div id="header">
<img src="../images/logo.png"  alt="logo" class="left"/>
<a href="#">[退出]</a>
</div>
 
 
<div id="navi">
<ul id="menu">
<li><a href="../index.html"  class="index_off"></a></li>
<li><a href="../role/role_list.html" class="role_off"></a></li>
<li><a href="../admin/admin_list.html"  class="admin_off"></a></li>
<li><a href="../fee/fee_list.html" class="fee_off"></a></li>
<li><a href="../account/account_list.html" class="account_off"></a></li>
<li><a href="../service/service_list.html"  class="service_off"></a></li>
<li><a href="bill_list.html" class="bill_on"></a></li>
<li><a href="../report/report_list.html"  class="report_off"></a></li>
<li><a href="../user/user_info.html"  class="information_off"></a></li>
<li><a href="../user/user_modi_pwd.html"  class="password_off"></a></li>
</ul>
</div>
 
 
<div id="main">
<form action="" method="">
 
<div class="search_add">
<div>身份证：<input type="text" value="230101111111111111" class="text_search"/></div>
<div>账务账号：<input type="text" value="admin1" class="width100 text_search"/></div>
<div>姓名：<input type="text" value="张三" class="width70 text_search"/></div>
<div>
<select class="select_search" id="selYears">
</select>
年
<select class="select_search" id="selMonths">
</select>
月
</div>
<div><input type="button" value="搜索" class="btn_search"/></div>
</div>
 
<div id="data">
<table id="datalist">
<tr>
<th class="width50">账单ID</th>
<th class="width70">姓名</th>
<th class="width150">身份证</th>
<th class="width150">账务账号</th>
<th>费用</th>
<th class="width100">月份</th>
<th class="width100">支付方式</th>
<th class="width100">支付状态</th>
<th class="width50"></th>
</tr>
<tr>
<td>1</td>
<td>张三</td>
<td>230102197902137862</td>
<td>admin1</td>
<td>543.45</td>
<td>2012年8月</td>
<td></td>
<td>未支付</td>
<td><a href="bill_item.html"  title="账单明细">明细</a></td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>230102197901111111</td>
<td>admin2</td>
<td>843.00</td>
<td>2012年9月</td>
<td>现金</td>
<td>已支付</td>
<td><a href="bill_item.html"  title="账单明细">明细</a></td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
<td>230111111111111111</td>
<td>admin3</td>
<td>12.00</td>
<td>2012年10月</td>
<td></td>
<td>未支付</td>
<td><a href="bill_item.html"  title="账单明细">明细</a></td>
</tr>
<tr>
<td>4</td>
<td>张三</td>
<td>230102197902137862</td>
<td>admin1</td>
<td>543.45</td>
<td>2012年8月</td>
<td></td>
<td>未支付</td>
<td><a href="bill_item.html"  title="账单明细">明细</a></td>
</tr>
<tr>
<td>5</td>
<td>李四</td>
<td>230102197901111111</td>
<td>admin2</td>
<td>843.00</td>
<td>2012年9月</td>
<td>现金</td>
<td>已支付</td>
<td><a href="bill_item.html"  title="账单明细">明细</a></td>
</tr>
<tr>
<td>6</td>
<td>王五</td>
<td>230111111111111111</td>
<td>admin3</td>
<td>12.00</td>
<td>2012年10月</td>
<td></td>
<td>未支付</td>
<td><a href="bill_item.html" title="账单明细">明细</a></td>
</tr>
</table>
<p>业务说明：<br/>
1、设计支付方式和支付状态，为用户自服务中的支付功能预留；<br/>
2、只查询近 3 年的账单，即当前年和前两年，如2013/2012/2011；<br/>
3、年和月的数据由 js 代码自动生成；<br/>
4、由数据库中的ｊｏｂ每月的月底定时计算账单数据。</p>
</div>
 
<div id="pages">
<a href="#">首页</a>
<a href="#">上一页</a>
<a href="#" class="current_page">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>
<a href="#">下一页</a>
<a href="#">末页</a>
</div>
</form>
</div>
 
<div id="footer">
<p>[源自橡树的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</p>
<p>版权所有(C)橡树信息科技有限公司 </p>
</div>
</body>
</html>
